<template>
	<view class="web">
		<view class="box">
			<view class="fenlei_pinglun">
			   <view class="pinglun_tou">
			    <img class="tou_img" src="../../static/psx/tou.png" alt="">
			    <p class="tou_p1">张妈妈</p >
			    <p class="tou_p2">来自分裂:孕期</p >
			   </view>
			   <p class="pinglun_text">
					崔老师，最近每天都要做多重任务，每个任务都很重要，感觉身体不适，应当怎样缓解?
			   </p >
			   <view class="" style="width: 100%;height: 80upx;">
			    <view class="pinglun_yuyin">
			     <view class="yuyin_ting">
			      <img class="ting_img" src="../../static/psx/yu.png" alt="">
			      <!-- <p class="ting_p">一元偷偷听</p > -->
			     </view>
			     <img class="yuyin_img" src="../../static/psx/doc.png" alt="">
			    </view>
			   </view>
			  </view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
.web{
	width:100%;
	height:100vh;
	background-color: ghostwhite;
}
.box{
	padding-top: 30upx;
}
.fenlei_pinglun {
  height: 260upx;
  /* margin-top: 30upx; */
  padding: 30upx;
  background-color: white;
 }

 .pinglun_tou {
  width: 100%;
  height: 80upx;
  display: flex;
  align-items: center;
 }

 .tou_img {
  width: 80upx;
  height: 80upx;
 }

 .tou_p1 {
  margin: 0 30upx 0 30upx;
 }

 .tou_p2 {
  color: gray;
 }

 .pinglun_text {
  margin: 10upx 0 10upx 0;
  letter-spacing: .1rem;
 }

 .pinglun_yuyin {
  width: 450upx;
  height: 80upx;
  float: right;
  display: flex;
  justify-content: space-between;
  align-items: center;
 }

 .yuyin_ting {
  width: 350upx;
  height: 60upx;
  border-radius: 35upx;
  background-color: #8FC31F;
  position: relative;
  top: 0;
  left: 0;
 }

 .yuyin_img {
  width: 80upx;
  height: 80upx;
 }

 .ting_img {
  width: 25upx;
  height: 35upx;
  position: absolute;
  top: 15upx;
  left: 30upx;
 }

 .ting_p {
  text-align: center;
  line-height: 60upx;
  color: white;
 }

</style>
